<template>
	<div class="item">
		<ul>
			<li v-for="(v,i) in this.$store.state.user.item" :key="i" @click="run(v.id)">
				<div class="left">
					<span :class="v.class"></span>
				</div>
				<div class="center">
					<p>{{v.name}}</p>
				</div>
				<div class="right">
					<span class="iconfont icon-jiantou1"></span>
				</div>
			</li>
		</ul>
		<h5>电脑端：i.chaoxing.com</h5>
	</div>
</template>

<script>
	export default{
		methods:{
			run(id){
				if(id===2){
					this.$router.push("/subject")
				}
			}
		},
		
	}
</script>

<style lang="scss" scoped="scoped">
	.item {
		width: 100%;
		h5{
			color: #b6b6b6;
			font-size: 0.12rem;
			font-weight: normal;
			margin-top: 0.2rem;
			text-align: center;
		}

		li {
			width: 100%;
			height: 0.58rem;
			background-color: #FFFFFF;
			line-height: 0.58rem;
			display: flex;
			.left {
				width: 0.24rem;
				.iconfont {
					font-size: 0.24rem;
				}
				margin-left: 0.27rem;
			}
			.center {
				width: 2.8rem;
				margin-left: 0.21rem;
			}
			.right {
				margin-right: 0.16rem;
			}
			.icon-daibanshixiang,.icon-xiaozu{
				color: #ff8379;
			}
			.icon-course,.icon-thin-_notebook_p{
				color: #01c8ab;
			}
			.icon-B{
				color: #50c1fb;
			}
		}

		li:first-child{
			margin-bottom:0.08rem ;
			

		}
		li:last-child{
			margin-top:0.08rem ;
		
		}
	}
</style>
